<!-- 求购详情 -->
<template>
	<div class="buyD">
		<section class="wCen">
			<div class="titlePage">
				<span class="titlePage_l">{{ $t("demand-detail-demand") }}</span>
				<span class="titlePage_r" v-if="localeCn">REQUIREMENT DETAILS</span>
			</div>
		</section>
		<section class="detail" v-if="detail">
			<div class="wCen card">
				<div class="tag tag1">{{ $t('demand-t31') }}</div>
				<!-- 基本信息 -->
				<div class="card_base">
					<div class="card_base_l">
						<p class="card_base_l_t">
							<span>{{ detail.title }}</span><img src="@/assets/img/icon_new.svg" alt=""
								v-if="isNew(detail.createTime)" class="img" />
						</p>
						<p class="card_base_l_txt">{{ $t("demand-label-demandTime") }}{{ detail.demandTime }}
						</p>
						<p class="card_base_l_txt" v-if="detail.label">
							{{ $t("demand-label-publish-person") }}{{ dictLabel(dict.type.supply_demand_label,detail.label) }}
						</p>
					</div>
					<div class="card_base_r">
						<template v-if="!detail.isMe">
							<span class="btn btn-disabled" v-if="isCollect">{{ $t("claimed") }}</span>
							<span class="btn hand" @click.stop="getCollect(detail)" v-else>{{ $t("claim") }}</span>
						</template>
						<!-- <div class="btns_share">
							  <span class="btns_share_i hand" @click="_initShare">
								<img src="@/assets/images/icon_share.png" alt="" class="img" /><span class="ml10 txt">{{ $t("share") }}</span>
							  </span>
							  <span class="btns_share_i" v-show="showShareBox">
								<div id="share"></div>
							  </span>
							  <span class="btns_share_i" v-if="JSON.stringify(detail) !== '{}'">
								<demands-like :key="detail.isLike" />
							  </span>
							</div> -->
					</div>
				</div>
				<!-- 基本描述 -->
				<div class="card_table">
					<p class="card_title">{{ $t("base-intro") }}</p>
					<div class="table">
						<dl class="lrr">
							<dt class="lrr_l">{{ $t("demand-detail-productPhoto") }}</dt>
							<dd class="lrr_r">
								<div class="imgBox">
									<img :src="detail.image" class="img" />
								</div>
							</dd>
						</dl>
						<dl class="lrr">
							<dt class="lrr_l">{{ $t("demand-detail-brandReq") }}</dt>
							<dd class="lrr_r">{{ detail.brandName }}</dd>
						</dl>
						<dl class="lrr">
							<dt class="lrr_l">{{ $t("demand-detail-createTime") }}</dt>
							<dd class="lrr_r">{{ parseTime(detail.createTime) }}</dd>
						</dl>
						<dl class="lrr">
							<dt class="lrr_l">{{ $t("demand-detail-regionalReq") }}</dt>
							<dd class="lrr_r">{{ detail.region }}</dd>
						</dl>
					</div>
				</div>
				<!-- 求购描述 -->
				<div class="card_desc">
					<p class="card_title">{{ $t("base-intro-buy") }}</p>
					<div class="content">{{detail.descr}}</div>
				</div>
				<!-- 联系方式 -->
				<!-- <div class="card_contact" v-if="detail && isGet">
					<p class="card_title">{{ $t("contact") }}</p>
					<div class="user">
						<div class="avatar">
							<img :src="detail.avatar" alt="" class="img" />
						</div>
						<span class="name">{{ detail.nickname }}</span>
					</div>
					<div class="contactTxt">
						<p class="item" v-if="detail.mobile">
							{{ $t("contact-mobile") }}<span
								class="txt">{{ isLogin ? detail.mobile : hideMobileTail(detail.mobile) }}</span>
						</p>
						<p class="item" v-if="detail.email">
							{{ $t("contact-email") }}<span
								class="txt">{{ isLogin ? detail.email : hideEmailTail(detail.email) }}</span>
						</p>
						<p>
							<span class="top" v-if="!isLogin">{{ $t("login-show") }}</span>
						</p>
					</div>
				</div> -->
			</div>
		</section>
	</div>
</template>

<script>
	import {
		getCollect,
	} from "@/api/demand";
	import util from "@/libs/util.js";
	export default {
		layout: "front",
		dicts: ["supply_demand_label"],
		props: {
			detail: {
				type: Object,
				required: true,
			},
		},
		computed: {
		},
		data() {
			return {
				isCollect: 0,
				showShareBox: false,
			};
		},
		mounted() {
			this.isCollect = this.detail ? this.detail.isCollect : 0;
		},
		methods: {
			_initShare() {
				this.showShareBox = true;
				socialShare("#share", {
					sites: ["weibo", "wechat"],
				});
				this.shareFun();
			},
			shareFun() {
				this.invoke(share, this.detail.id).then((res) => {
					if (res && res.code == 200) {}
				});
			},
			// 领取
			getCollect(item) {
				if (!this.userInfo) {
					this.$modal.confirm(this.$t("tip-login"), this.locale).then(() => {
						this.go2Login();
					});
					return;
				}
				this.invoke(getCollect, this.detail.id).then((res) => {
					if (res && res.code == 200) {
						this.$message.success(this.$t("claim-success"));
						this.isCollect = 1;
					}
				});
			},
		},
	};
</script>
<style lang="scss" scoped src="@/assets/styles/demand-share.scss"></style>
<style lang="scss" scoped src="@/assets/styles/demand-detail.scss"></style>
<style lang="scss" scoped>
	.buyD {
		padding-bottom: 100px;
		background-color: #f1f1f1;
	}
</style>